<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<base href="__ROOT__/" />
	<title>京东(JD.COM)-综合网购首选-正品低价、品质保障、配送及时、轻松购物！</title>
	<link rel="stylesheet" href="__PUBLIC__/css/bootstrap.min.css">
	<link rel="stylesheet" href="__PUBLIC__/css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="__PUBLIC__/css/front.css">
	<link rel="stylesheet" href="__PUBLIC__/css/nivo-slider.css">
	
</head>
<body id="product_detail">
	<div class="container">
		<include file="./Application/Home/View/header.php" />
		<br /><br />
		<div class="row">
			<div class="col-md-6">
				<div id="product_imgs">
					<img id="product_main_img" src="__ROOT__<?=$product['img']?>" />
					<ul>
					<?php foreach($imgs as $i){?>
						<li><img class="hover" src="__ROOT__<?=$i['url']?>"></li>
						<?php }?>
					</ul>
				</div>
			</div>
			<div class="col-md-6">
				<div id="product_main">
					<h3><?=$product['title']?></h3>
					<table class="product_arg">
						<tr>
							<td class="l">价格：</td>
							<td class="price">¥<?=$product['price']?></td>
						</tr>
						<tr>
							<td class="l">商品评分：</td>
							<td class="star">
								<?php for($i=0;$i<5;$i++){?>
									<?php if($i<$product['star']){?>
									<i class="glyphicon glyphicon-star"></i>
									<?php }else{?>
									<i class="glyphicon glyphicon-star-empty"></i>
									<?php }?>
								<?php }?>
							</td>
						</tr>
						<tr>
							<td class="l">运费：</td>
							<td class="deliver_fee">满99免运费</td>
						</tr>
						<form action="<?=U("shopping/addToCart")?>" method="post">
						<input type="hidden" name="product_id" value="<?=$product['id']?>">
							<tr>
								<td class="l">购买数量：</td>
								<td class="num">
									<span class="minus">-</span><input name="num" type="text" class="n" value="1"><span class="add">+</span>
								</td>
							</tr>
							<tr>
								<td class="l">配送至：</td>
								<td class="deliver">北京朝阳区三环以内 有货支持 货到付款 免运费 由梦琪数码专营店从 广东广州市 发货，并提供售后服务。</td>
							</tr>
						</table>
								<a href="" class="btn btn-success btn-lg">立即购买</a>
								<button type="submit" class="btn btn-danger btn-lg">加入购物车</button>
						</form>
				</div>
			</div>
		</div>
		<div class="row">
			<div class="col-md-3"></div>
			<div class="col-md-9">
			<h3>宝贝详情</h3>
				<?=htmlspecialchars_decode($product['content'])?>
			</div>
		</div>
	</div>
	<script type="text/javascript" src="__PUBLIC__/js/jquery-3.1.0.min.js")?>"></script>
	<script type="text/javascript" src="__PUBLIC__/js/jquery.elevateZoom-3.0.8.min.js")?>"></script>
	<script type="text/javascript">
	    $(function(){
		    $('#product_imgs ul li').mouseover(function(){
		    	$('#product_imgs ul li').removeClass("hover");
		    	$(this).addClass('hover');
		    	var src = $(this).find('img').attr('src');
		    	$('#product_main_img').attr('src',src);	
		    	$('.zoomWindowContainer div').css('background-image','url("'+src+'")')	    	
		    })
		    $('.num .add').click(function(){
		    	var n = $(".num .n").val();
		    	n = parseInt(n)+1;
		    	$(".num .n").val(n);
		    })
		    $('.num .minus').click(function(){
		    	var n = $(".num .n").val();
		    	n = parseInt(n)-1;
		    	if(n>0){
		    		$(".num .n").val(n);
		    	}
		    });
		    $('#product_main_img').elevateZoom({
		    	zoomWindowWidth: 300,
		    	zoomWindowHeight: 300
		    });
	    });
    </script>
</body>
</html>
																	
																	
																	
																	
							
																	
																	
																	
																	
